const currentDate = new Date();
let selectedDate = currentDate;
let tasks = [];

// 渲染日历
function renderCalendar() {
    console.log("renderCalendar--------------------开始");
    
    console.log("currentDate--刚开始的值: " + currentDate);
    console.log("selectedDate--刚开始的值: " + selectedDate);
    
    // 获取当前的年月， 并显示到currentMonth节点
    const currentDateString = selectedDate.toLocaleString('default', { month: 'long', year: 'numeric' });
    console.log("当前年月：" + currentDateString); // 2025年1月

    // 将currentMonth元素挂载到dom
    document.getElementById('currentMonth').innerText = currentDateString;

    
    // console.log("currentDate: " + currentDate);
    // console.log("selectedDate: " + selectedDate);
    

    /* 设置这个月的1号是星期几 */
    // 获取当前年月1号的时间数据
    const firstDayOfMonth = new Date(selectedDate.getFullYear(), selectedDate.getMonth(), 1);
    console.log("firstDayOfMonth-当前年月1号的数据: " + firstDayOfMonth); // Wed Jan 01 2025 00:00:00 GMT+0800 (中国标准时间)
    
    //返回当前星期名(0-6,0表示星期天)
    // 当前年月1号是星期几
    const firstDayOfWeek = firstDayOfMonth.getDay();
    console.log("firstDayOfWeek-当前年月1号是星期:" + firstDayOfWeek); // 3   星期3

    // 获取当前月份共有多少天
    // 当前月总天数、当前月末尾号数
    const daysInMonth = new Date(selectedDate.getFullYear(), selectedDate.getMonth() + 1, 0).getDate(); // 31
    console.log("daysInMonth-当前月总天数、当前月末尾号数: " + daysInMonth);
    
    const cells = document.querySelector('.cells');
    cells.innerHTML = '';

    // 循环空不属于当月的日期
    // firstDayOfWeek： 3
    for (let i = 0; i < firstDayOfWeek; i++) {
        const cell = document.createElement('div');
        cells.appendChild(cell);
    }

    // 循环当前月的天数
    // daysInMonth: 31天
    for (let i = 1; i <= daysInMonth; i++) {
        const cell = document.createElement('div');
        cell.innerText = i;
        cell.addEventListener('click', () => {
            openTaskModal(i); // 点击某一天显示当天的任务列表？
        });

        // 当i=currentDate.getDate()时，说明到了当天日期
        if (areDatesEqual(currentDate, selectedDate) && i === currentDate.getDate()) {
            cell.classList.add('highlight');
        }

        cells.appendChild(cell);
    }
    
}

// 判断2个日期是否为同一天
function areDatesEqual(date1, date2) {
    console.log("areDatesEqual----------------------------开始");
    console.log(date1);
    console.log(date2);
    console.log("areDatesEqual----------------------------结束");
    return date1.getDate() === date2.getDate() 
    && date1.getMonth() === date2.getMonth() 
    && date1.getFullYear() === date2.getFullYear();
}

function prevMonth() {
    selectedDate.setMonth(selectedDate.getMonth() - 1);
    renderCalendar();
}

function nextMonth() {
    selectedDate.setMonth(selectedDate.getMonth() + 1);
    renderCalendar();
}

function addTask() {
    const taskInput = document.getElementById('taskInput');
    const taskText = taskInput.value;

    if (taskText.trim() === '') {
        return;
    }

    const task = {
        date: selectedDate.getDate(),
        month: selectedDate.getMonth() + 1,
        year: selectedDate.getFullYear(),
        text: taskText
    };

    tasks.push(task);
    taskInput.value = '';
    renderTaskList();
}

function renderTaskList() {
    const taskList = document.getElementById('taskList');
    taskList.innerHTML = '';

    for (let i = 0; i < tasks.length; i++) {
        const task = tasks[i];

        if (task.date === selectedDate.getDate() && task.month === selectedDate.getMonth() + 1 && task.year === selectedDate.getFullYear()) {
            const listItem = document.createElement('li');
            listItem.innerText = task.text;
            taskList.appendChild(listItem);
        }
    }
}

function openTaskModal(day) {
    selectedDate.setDate(day);
    renderTaskList();
}

renderCalendar();


